import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:myflutterproject/routes.dart';
import 'package:myflutterproject/utils/overScrollBehavior.dart';

/*Material Components Widgets*/
class BaseMaterialWidgets extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Material Components Widgets"),
        centerTitle: true,
      ),
      body: Center(
        child: ScrollConfiguration(
          behavior: OverScrollBehavior(),
          child: ListView(
            children: <Widget>[
              Container(
                padding: EdgeInsets.all(10),
                child: Text(
                  '（Material Components Widgets：视觉、效果、motion-rich的widget。）',
                  style: TextStyle(
                    fontSize: 20,
                  ),
                ),
              ),
              Container(
                padding: EdgeInsets.all(10),
                child: Text(
                  'App结构和导航：',
                  style: TextStyle(
                    fontSize: 20,
                  ),
                ),
              ),
              ItemButton('Scaffold', scaffoldDemo),
              ItemButton('Appbar', appbardemo),
              ItemButton('BottomNavigationBar', scaffoldDemo),
              ItemButton('TabBar', appbartabdemo),
              //显示与当前选中的选项卡相对应的页面视图。通常和TabBar一起使用
              ItemButton('TabBarView', appbartabdemo),
              ItemButton('Navigator路由跳转', navigatordemo),
              ItemButton('MaterialApp', basematerialapp),
              ItemButton('Drawer', drawerdemo),
              TextWidget('按钮:'),
              ItemButton('RaisedButton', raisedbuttondemo),
              ItemButton('FloatingActionButton', counterDemo),
              ItemButton('FlatButton', flatbuttondemo),
              ItemButton('IconButton(点击时会有水波动画)', basematerial),
              ItemButton('PopupMenuButton', followmeituandemo),
              ItemButton('ButtonBar(水平排列的按钮组)', buttonbardemo),
              TextWidget('输入框和选择框:'),
              ItemButton('TextField(文本输入框)', textfielddemo),
              ItemButton('Checkbox(复选框)', switchandcheckboxdemo),
              ItemButton('Radio(单选框)', radiodemo),
              ItemButton('Switch(On/off 用于切换一个单一状态)', switchandcheckboxdemo),
              ItemButton('Slider(滑块，允许用户通过滑动滑块来从一系列值中选择。)', sliderdemo),
              ItemButton('Date & Time Pickers(日期&时间选择器)', dataandtimepickers),
              TextWidget('对话框、Alert、Panel:'),
              ItemButton('SimpleDialog(简单对话框可以显示附加的提示或操作)', simpledialogdemo),
              ItemButton('AlertDialog(一个会中断用户操作的对话款，需要用户确认)', alertdialogdemo),
              ItemButton(
                  'BottomSheet(一个从屏幕底部滑起的列表（以显示更多的内容）)', bottomsheetdemo),
              ItemButton('ExpansionPanel(折叠面板)', expansionpaneldemo),
              ItemButton('SnackBar(具有可选操作的轻量级消息提示，在屏幕的底部显示。)', basegesture),
              TextWidget('信息展示:'),
              ItemButton('Image', imageDemo),
              ItemButton(
                  'Chip(标签，一个Material widget。 它可以将一个复杂内容实体展现在一个小块中，如联系人)',
                  chipdemo),
              ItemButton('Tooltip(一个文本提示工具,长按显示)', tooltipdemo),
              ItemButton('DataTable(表格数据)', datatabledemo),
              ItemButton('Card(带阴影和圆角的卡片)', carddemo),
              ItemButton('LinearProgressIndicator(线性进度指示器/水平进度条)', linearprogressdemo),
              TextWidget('布局:'),
              ItemButton('ListTile', carddemo),
              ItemButton('Stepper（步骤指示器）', stepperdemo),

            ],
          ),
        ),
      ),
    );
  }
}

class ItemButton extends StatelessWidget {
  final String name;
  final String roate;

  ItemButton(this.name, this.roate);

  @override
  Widget build(BuildContext context) {
    return FlatButton(
        padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
        onPressed: () => Navigator.pushNamed(context, roate),
        child: Text(
          name,
          style: TextStyle(fontSize: 20, color: Colors.blue),
        ));
  }
}

class TextWidget extends StatelessWidget {
  final String name;

  TextWidget(this.name);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(vertical: 15, horizontal: 25),
      child: Text(
        name,
        style: TextStyle(fontSize: 20, color: Colors.black),
      ),
    );
  }
}
